<template>
    <div>
        <a-row>
            <!-- v-userAuth="'F2'" -->
            <a-row class='mytitle'>
                <!-- <a-icon :component="alarm" style="margin:0 .5rem 0 0"/> -->
                告警通知配置
            </a-row>

            <!-- <NoAuthPage v-showNoAuth="'F2-1'" /> -->

            <a-row style="margin:1em" v-userAuth="'F2-1'">
                <a-card hoverable>
                    <div style="margin:0 0 1em 0;">
                        <a-button type='primary' @click="handleSet">
                            {{$t('Create')}}
                        </a-button>
                        <div class="config-out-box">
                            <SMTP />
                            <EMail @switch-change="handleSwitch" :checked="smtp"/>
                            <SNMP @switch-change="handleSwitch" :checked="snmp"/>
                        </div>
                        <div class="config-out-box">
                            <Wechat @switch-change="handleSwitch" :checked="wechat" />
                            <Ding @switch-change="handleSwitch" :checked="hook" />
                        </div>
                    </div>
                </a-card>
            </a-row>
        </a-row>

        <!-- <configDialog ref="dialogRef" @get-list="getList" /> -->
    </div>
</template>
<script>
import NoAuthPage from '@/components/common/NoAuthPage'
import SMTP from './alarmConfig/SMTP.vue'
import EMail from './alarmConfig/EMail.vue'
import SNMP from './alarmConfig/SNMP.vue'
import Wechat from './alarmConfig/Wechat.vue'
import Ding from './alarmConfig/Ding.vue'

export default {
    name: 'alarmConfig',
    components: { NoAuthPage, SMTP, EMail, SNMP, Wechat, Ding },
    data() {
        return {
            hook: 1,
            smtp: 1,
            snmp: 1,
            wechat: 1
        }
    },
    mounted() {
        this.getList()
    },
    methods: {
        async getList() {
            const { data: { mes } } = await this.$api.alarm.getAlarmSwitch();
            const { data } = await this.$api.alarm.getAlarmRate();
            this.$refs.dialogRef.formData = data.mes
            this.hook = mes.hook
            this.smtp = mes.smtp
            this.snmp = mes.snmp
            this.wechat = mes.wechat
        },
        handleSet() {
            this.$refs.dialogRef.isShow = true
        },
        async handleSwitch(item) {
            const { data } = await this.$api.alarm.modifyAlarmSwitch(item);
            console.log(data)
            this.getList()
        }
    }
}
</script>
<style>
.config-out-box {
    display: flex;
    justify-content: space-around;
    margin: 20px;
}
</style>
